<!Doctype html>
<html xmlns=http://www.w3.org/1999/xhtml>
<head>
<title>帐号注册-思绪（测试版）</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="../css/bootstrap.min.css" type="text/css">
<style type="text/css">
body {
	padding-top: 50px;
}
</style>
<link rel="stylesheet" href="../css/bootstrap-responsive.min.css"
	type="text/css">

<script type="text/javascript" src="../js/jquery-1.7.min.js"></script>
<script type="text/javascript" src="../js/jquery.tmpl.min.js"></script>
<script type="text/javascript" src="../js/bootstrap.min.js"></script>
<script type="text/javascript" src="../js/tools.js"></script>
<script type="text/javascript" src="../js/formValidatorRegex.js"></script>

<style>     
    strong {
        font-size: 20px;
    }
    .form-signin {
        max-width: 300px;
        _width: 300px;
        padding: 19px 29px 29px;
        margin: 0 auto 20px;
        border: 1px solid #e5e5e5;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
        -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
        -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
        box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
    }
    
    .form-signin .form-signin-heading, .form-signin .checkbox {
        margin-bottom: 10px;
    }
    
</style>

</head>
<body>
	<div class="container">
		<form class="form-signin hide" action="/member/reg.json" style="left: 40%;top: 15%;position: absolute;" id="form">
			<strong>注册-思绪</strong>
			<hr>
			<div>
				用户名<input value="" name="member.email" type="text" class="input-xlarge" placeholder="输入用户名或邮箱..."><label for="member.email"></label>
				密码<input value="" name="member.password" type="password" class="input-xlarge" placeholder="输入密码"><label for="member.password"></label>
				重复密码<input type="password" name="password2" v="#member.password @ 两次密码不一致" class="input-xlarge" placeholder="输入密码"><label for="password2"></label>
			</div>
			<div>
				<button class="btn btn-large btn-primary pull-left" type="submit">注册帐号</button>
			</div>
			<div class="pull-right">
				<div id="error"></div>
				<p>
					<a href="#" id="toDoc">查看帮助</a>
				</p>
				<p>
					<a href="/draft.zip">Chrome插件</a>
				</p>
			</div>
		</form>
		
		<div class="offset4 span4 well" id="doc">
			<p>思绪是一个用来记录思维火花的一个Chrome插件，当有一些想法时，你可以迅速点击浏览器右上角就可以书写了。无疑对程序员尤其是WEB程序员来说，浏览器时刻处于运行状态。
		加之Chrome实为调试利器，故暂仅支持Chrome。</p>
			<hr/>
			<p><code>思绪记录个人思维活动状态，按时间顺序记录，没有修改，没有删除，只是忠实可靠的记录，实属极度个人隐私。</code>
			虽说存在云端方便，永远不丢失，但仍极力推荐大家单机使用或自己架设服务器使用。创业的点子宝贵着呢 <strong>:-)</strong></p>
			<hr/>
			<p>
				Chrome插件下载地址：<a href="/draft.zip">思绪(draft.zip)</a>, 解压后就可以使用了，后端源码整理完毕后会开源。
			</p>
			<p>
				如果您觉的隐私之类的无所谓，<a href="#" id="reg">点击注册</a>，不保证数据泄露、丢失或其它任何责任。
			</p>
		</div>
	</div>

	<div class="modal hide" id="myModal">
		<div class="modal-header">
			<a class="close" data-dismiss="modal">×</a>
			<h3>帐号注册成功</h3>
		</div>
		<div class="modal-body">
			<p>请使用Chrome插件，下载地址 : <a href="/draft.zip">思绪(draft.zip)</a></p>
		</div>
		<div class="modal-footer">
			<a href="#" class="btn" data-dismiss="modal">关闭</a>
		</div>
	</div>
	
	<script type="text/javascript">
		$('#reg').click(function(){
			$('#doc').hide();
			$('#form').show();
		});
		
		$('#toDoc').click(function(){
			$('#doc').show();
			$('#form').hide();
		});
		
		$(function(){
			var f = $('#form').vInit({
				action : contextPath + "/member/reg.json",
				ajaxV : true,
				success : function(json){
					$('#myModal').modal('show')
				},
				vfail : function(json){
					console.log(JSON.stringify(json))
				},
				errorLabel : $("#error")
			});
		});
	</script>
</body>
</html>